<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>layui</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<link rel="stylesheet" href="__static/lib/layui-v2.5.5/css/layui.css" media="all">
	<link rel="stylesheet" href="__static/css/public.css" media="all">
	<style>
		.layui-form-pane .layui-form-label {
			width: 90px;
		}
	</style>
</head>
<body>
<div class="layuimini-container">
	<div class="layuimini-main">
		<fieldset class="table-search-fieldset">
			<legend>搜索信息</legend>
			<form class="layui-form layui-form-pane" action="">
				<div class="layui-form-item" style="margin-bottom: 5px;">
					<div class="layui-inline">
						<label class="layui-form-label">账户ID</label>
						<div class="layui-input-inline">
							<select name="op_account_id"  lay-search="" autocomplete="off">
								<option value="" >直接选择或搜索选择</option>
								{volist name="OpAccount_list" id="vo"}
									<option value="{$vo.id}" >{$vo.name_id}</option>
								{/volist}
					        </select>
						</div>
						<label class="layui-form-label">运营</label>
						<div class="layui-input-inline">
							<select name="operate_id"  lay-search="" autocomplete="off">
								<option value="" >直接选择或搜索选择</option>
								{volist name="operate_list" id="vo"}
									<option value="{$vo.id}" >{$vo.username}</option>
								{/volist}
					        </select>
						</div>
						<label class="layui-form-label">媒介</label>
						<div class="layui-input-inline">
							<select name="media_id"  lay-search="" autocomplete="off">
								<option value="" >直接选择或搜索选择</option>
								{volist name="media_list" id="vo"}
									<option value="{$vo.id}" >{$vo.username}</option>
								{/volist}
					        </select>
						</div>
						<label class="layui-form-label">时间</label>
						<div class="layui-input-inline">
							<input type="text" name="time" autocomplete="off" class="layui-input" id="test3" placeholder=" & ">
						</div>
					</div>
					<div class="layui-inline">
						<button type="button" class="layui-btn layui-btn-primary"  lay-submit lay-filter="data-search-btn"><i class="layui-icon"></i> 搜 索</button>
					</div>
				</div>
			</form>
		</fieldset>
		<table class="layui-hide" id="currentTableId" lay-filter="currentTableFilter"></table>
		<script type="text/html" id="currentTableBar">
			<a  class="layui-btn layui-btn-normal layui-btn-xs data-count-edit" lay-event="edit">消耗明细</a>
			<a  class="layui-btn layui-btn-normal layui-btn-xs data-count-edit" lay-event="edit2">账户明细</a>
		</script>
		<script type="text/html" id="fansTable">
			<span style="{{d.is_fans==0?'':'display:none'}}" class="layui-badge layui-bg-gray">否</span>
			<span style="{{d.is_fans>=1?'':'display:none'}}" class="layui-badge">是</span>
		</script>
		<script type="text/html" id="accType">
			{{d.acc_type == 1?'自运营':''}}
			{{d.acc_type == 2?'代运营':''}}
			{{d.acc_type == 3?'代充值':''}}
		</script>
	</div>
</div>
<script src="__static/lib/layui-v2.5.5/layui.js" charset="utf-8"></script>
<script src="__static/js/lay-config.js?v=1.0.4" charset="utf-8"></script>
<script src="__static/js/man.js" charset="utf-8"></script>
<script>

	var $,form,table,laydate
	layui.use(['form', 'table', 'tableSelect', 'laydate'], function () {
		$ = layui.jquery , form = layui.form , table = layui.table , laydate = layui.laydate
		//年月选择器
		laydate.render({
		  	elem: '#test3'
			,range: '&'
		});
		table.render({
			elem: '#currentTableId',
			id:'consume_stat',
			url: '{:url("consume_stat")}?t=json',
			method : 'post',
			height: 'full-150',
			toolbar: true,
			totalRow: true,
			cols: [[
				{ field: 'name_id', title: '账户Id',width:130,totalRowText: '合计',fixed: 'left'},
				{ field: 'customer_name', title: '客户名称' ,width:120},
				{ field: 'acc_type', title: '运营类型',toolbar: '#accType',width:120},
				{ field: 'channel_name', title: '端口' ,width:100},
			    { field: 'total_currency', title: '账户充值(币)' ,width:130,totalRow: true},
			    { field: 'total_consume', title: '账户消耗(币)' ,width:130,totalRow: true},
			    { field: 'acc_refund', title: '账户退款(币)' ,width:130,totalRow: true},
				{ field: 'profit', title: '公司利润(元)' ,width:130,totalRow: true},
				{ field: 'sell_rebates', title: '销售利润(元)' ,width:130,totalRow: true,  templet: function(d){
			          return d.sell_rebates?Math.floor(d.sell_rebates * 100) / 100 :0
			    }},
				{ field: 'consume_profit', title: '消耗利润(元)' ,totalRow: true,width:130},
				{ field: 'media_name', title: '媒介',width:180},
				{ field: 'operate_name', title: '运营' ,width:180},
				// { field: 'create_time', title: '开始时间' ,width:180,  templet: function(d){
			    //       return d.create_time?d.create_time:''
			    // }},
				// { field: 'end_time', title: '结束时间' ,width:180,  templet: function(d){
			    //       return d.end_time?date('Y-m-d',d.end_time):''
			    // }}, 
			   /*  { title: '操作', width: 200, fixed: 'right', toolbar: '#currentTableBar',align:'center'} */
			]],
			limit: 30,
			page: false,
			skin: 'line'
		});
		var data,t;
		table.on('rowDouble(currentTableFilter)', function(obj){
			data = obj.data;
			t = $("input[name=time]").val()?$("input[name=time]").val():0;
		}); 
		$(document).on("dblclick", "td",function () { 
			
			var s = $(this).attr('data-field');
			var v = $(this).find('div').html();
			if((s == 'total_currency'||s == 'acc_refund'||s == 'total_consume')&&v>0){
				
				switch (s) {
					case 'total_consume':
						get_xh_info(data.op_account_id,data.id,t);
					break;
					case 'total_currency':
						get_cz_info(data.op_account_id,t,data.id);
					break;
					case 'acc_refund':
						get_acc_refund_info(data.id,data.op_account_id,t);
					break;
					
				}
			}
		}) 
		/* table.on('tool(currentTableFilter)', function (obj) {
			var data = obj.data;
			var t = $("input[name=time]").val()?$("input[name=time]").val():0;
			switch (obj.event) {
				case 'edit':
					get_xh_info(data.id,t);
				break;
				case 'edit2':
					get_cz_info(data.id,t);
				break;
			}
		}); */
		//消耗明细
		function get_xh_info(op_account_id,items_id,t){
			layer.open({
		        type: 2,
		        title:'账户消耗明细',
		        area: ['80%', '80%'],
		        fixed: false, //不固定
		        maxmin: true,
		        shadeClose:true,	//点击遮罩后关闭提示框
		        scrollbar:false, //- 是否允许浏览器出现滚动
		        content: "{:url('stat_consume_info')}?op_account_id="+op_account_id+'&t='+t+'&items_id='+items_id
		    });
		    //layer.full(index);
		}
		//充值明细
		function get_cz_info(id,t,items_id){
			layer.open({
		        type: 2,
		        title:'账户充值明细',
		        area: ['80%', '80%'],
		        fixed: false, //不固定
		        maxmin: true,
		        shadeClose:true,	//点击遮罩后关闭提示框
		        scrollbar:false, //- 是否允许浏览器出现滚动
		        content: "{:url('stat_recharge_info')}?id="+id+'&t='+t+'&items_id='+items_id
		    });
		    //layer.full(index);
		}
		
		//账户退款明细
		function get_acc_refund_info(id,op_account_id,t){
			layer.open({
		        type: 2,
		        title:'账户退款明细',
		        area: ['80%', '80%'],
		        fixed: false, //不固定
		        maxmin: true,
		        shadeClose:true,	//点击遮罩后关闭提示框
		        scrollbar:false, //- 是否允许浏览器出现滚动
		        content: "{:url('stat_acc_refund_info')}?id="+id+'&t='+t+'&op_account_id='+op_account_id
		    });
		    //layer.full(index);
		}
		//搜索
		form.on('submit(data-search-btn)', function(data){
			var articleFrom = data.field;
		
			table.reload('consume_stat', {
			  	url: '{:url("consume_stat", ["t"=>"json"])}',
				where:articleFrom
			});
			return false;
		  });
		
	});
	function get_apply(msg){
		table.reload('consume_stat', {
			  url: '{:url("consume_stat")}?t=json',
			});
		layer.msg(msg, {icon: 6});
	}
	
	
</script>

</body>
</html>